<!DOCTYPE html>
<html>

<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title>课程详情</title>
		<link rel="stylesheet" type="text/css" href="__CSS__api.css" />
		<link rel="stylesheet" type="text/css" href="__CSS__aui.css" />
		<link rel="stylesheet" type="text/css" href="__CSS__video-js.min.css" />

		<style>
			#all_header{
				padding-top:10.45rem;
			}
			.vedio {
					position: fixed;
					top:0;
					left: 0;
					width: 100%;
					height: 10.45rem;
					overflow: hidden;
					z-index: 1000
			}

			.mask {
					position: absolute;
					width: 100%;
					height: 100%;
					background: rgba(0, 0, 0, 0.4);
					line-height: 10.45rem;
					text-align: center;
					font-size: 1rem;
			}
			#render-item-1{
				position: relative;
				
			}
				.instruction {
						background-color: #fff;
						padding: 0.75rem;
						padding-bottom: 0;
						margin-bottom: 0.5rem;
				}

				.title {
						font-weight: bold;
						font-size: 0.75rem;
						color: #333;
				}

				.play_times {
						font-size: 0.75rem;
						color: #999;
				}

				.like,
				.share,
				.download {
						float: right;
						width: 1.5rem;
						height: 1.5rem;
						margin-left: 1rem;
				}

				.play_all {
						height: 30px;
						line-height: 30px;
				}

				.download {
						background: url(__IMG__main3_download.png) no-repeat center center;
						background-size: 22px 22px;
				}

				.share {
						background: url(__IMG__main3_share.png) no-repeat center center;
						background-size: 22px 22px;
				}

				.like img {
						width: 22px;
						height: 22px;
						margin: 4px auto;
				}

				.class_type {
						line-height: 2.5rem;
						margin-top: 0.5rem;
				}

				.course_type {
						color: #999;
						font-size: 0.75rem;
				}

				.type_detail {
						color: #4FBF04;
						font-size: 0.7rem;
						float: right;
				}
				/*价格 红色字体*/

				.money {
						font-size: 0.7rem;
						color: #FE0030;
						float: right;
				}
				/*tab*/

				.aui-bar-nav .aui-pull-right {
						padding-right: 0.75rem;
				}

				.aui-tab-item.aui-active {
						color: #E73C5C;
						font-weight: bold;
						font-size: 0.8rem;
						border: 0;
				}

				.aui-active:after {
						content: '';
						display: block;
						height: 0px;
						width: 100%;
						border-top: 2px solid #E73C5C;
						bottom: 0px;
						position: absolute;
				}

				.fenlei {
						width: 4.2rem;
						margin-left: 0.75rem;
						display: box;
				}

				.juzhon1 {
						width: 100%;
						height: 1.25rem;
						line-height: 1rem;
						text-align: center;
						font-size: 11px;
				}

				.sss {
						margin: 0px 15px;
						width: 100%;
				}

				.aui-tab-item {
						height: 2.4rem;
						line-height: 2.4rem;
						font-size: 0.8rem;
						color: #333;
				}

				#my-player {
						position: relative;
						width: 100%;
						height: 10.45rem
				}

				.stop-button {
						position: absolute;
						top: 40%;
						left: 50%;
						-webkit-transform: translate(-50%);
						transform: translate(-50%);
						width: 42px;
						height: 42px;
						background: url("__IMG__main3_stop.png") center center no-repeat;
						background-size: 42px;
				}

				.play-button {
						position: absolute;
						top: 40%;
						left: 50%;
						-webkit-transform: translateX(-50%);
						transform: translateX(-50%);
						width: 42px;
						height: 42px;
						background: url("__IMG__main3_play.png") center center no-repeat;
						background-size: 42px;
				}

				.lock-button {
						position: absolute;
						top: 40%;
						left: 10%;
						-webkit-transform: translateX(-50%);
						transform: translateX(-50%);
						width: 42px;
						height: 42px;
						background: url("__IMG__main3_lock.png") center center no-repeat;
						background-size: 42px;
				}

				.unlock-button {
						position: absolute;
						top: 40%;
						left: 10%;
						-webkit-transform: translateX(-50%);
						transform: translateX(-50%);
						width: 42px;
						height: 42px;
						background: url("__IMG__main3_unlock.png") center center no-repeat;
						background-size: 42px;
				}

				.vjs-default-skin .vjs-big-play-button {
						display: none
				}

				.video-js .vjs-time-control {
						display: block;
				}

				.video-js .vjs-remaining-time {
						display: none;
				}

				.vjs-default-skin.vjs-big-play-centered .vjs-big-play-button {
						display: none;
				}

				video-js .vjs-big-play-button {
						display: none !important;
				}

				.video-js .vjs-big-play-button {
						font-size: 2.5em;
						line-height: 2.3em;
						height: 2.5em;
						width: 2.5em;
						-webkit-border-radius: 2.5em;
						-moz-border-radius: 2.5em;
						border-radius: 2.5em;
						background-color: #73859f;
						background-color: rgba(115, 133, 159, .5);
						border-width: 0.15em;
						margin-top: -1.25em;
						margin-left: -1.75em;
				}
				/* 中间的播放箭头 */

				.vjs-big-play-button .vjs-icon-placeholder {
						font-size: 1.63em;
				}
				/* 加载圆圈 */

				.vjs-loading-spinner {
						font-size: 2.5em;
						width: 2em;
						height: 2em;
						border-radius: 1em;
						margin-top: -1em;
						margin-left: -1.5em;
				}
				#tab{
					display: flex;
					background: white;
					padding: 0 0.75rem
				}
				.tab-item{
					flex: 1;
					height: 2.5rem;
					text-align: center;
					line-height: 2.5rem;
					color: #333333;
					font-size: 0.8rem
				}
				.tab-item-active{
					position: relative;
					color: #E73C5C;
					font-weight: bold;
				}
				.tab-item-active:after {
      content: '';
      display: block;
      height: 0px;
      width: 100%;
      border-top: 2px solid #E73C5C;
      bottom: 0px;
      position: absolute;
    }

    .fuwenben {
      padding: 0.75rem;
      background-color: #fff;
      margin-bottom: 0.5rem;
    }

    .comment {
      background-color: #ffffff;
      width: 100%;
      height: auto;
      padding: 0 0.75rem;
      /*margin-top: 0.525rem;*/
    }

    .avatar {
      width: 1.75rem;
      height: 1.75rem;
      margin-right: 0.75rem;
    }

    .avatar img {
      width: 100%;
      height: 100%;
    }

    .name {
      height: 1.75rem;
      line-height: 1.75rem;
      color: #333;
      font-size: 13px;
    }

    .delete {
      width: 0.85rem;
      height: 0.85rem;
      margin-top: 0.45rem;
    }

    .talk_xq {
      color: #333;
      font-size: 14px;
      padding-top: 0.325rem;
      padding-bottom: 0.7rem;
      line-height: 1rem;
    }

    .time1 {
      color: #B3B3B3;
      font-size: 12px;
    }

    .all_comment {
      color: #333;
      font-size: 0.7rem;
      background-color: #fff;
      padding: 1rem 0.75rem 0.2rem;
    }

    .comment_input {
      /*height: 1.6rem;*/
      padding: 0 0.75rem;
      padding-top: 0.25rem;
      background-color: #fff;
      position: relative;
      padding-bottom: 1rem;
    }

    #comment {
      width: 100%;
      border-radius: 0.8rem;
      background-color: #F5F5F5;
      padding: 0;
      height: 1.6rem;
      margin: 0;
      padding-left: 1.5rem;
    }

    .comment_img {
      position: absolute;
      left: 0.75rem;
      top: 0.25rem;
      width: 1.5rem;
      height: 1.6rem;
      background: url(__IMG__write@3x.png) no-repeat center center;
      background-size: 15px 15px;
    }

    .footerr {
      height: 3.5rem;
      background-color: #fff;
    }

    .buy {
      height: 2.5rem;
      border-radius: 0.25rem;
      background-color: #E73C5C;
      color: #fff;
      font-size: 0.8rem;
      font-weight: bold;
      text-align: center;
      line-height: 2.5rem;
      margin: 0.5rem 0.75rem;
    }

    .comment222 {
      margin-top: 0.5rem;
      padding: 0.75rem;
      font-size: 0.7rem;
      background-color: #fff;
    }

    .comment_title {
      margin-bottom: 0.75rem;
    }

    .user_img {
      width: 2.5rem;
    }

    .user_img img {
      width: 1.75rem;
      height: 1.75rem;
      border-radius: 50%;
    }

    .user_name {
      font-size: 0.65rem;
      height: 1.75rem;
      line-height: 1.75rem;
    }

    .comment_delete {
      float: right;
      width: 2.5rem;
      height: 1.75rem;
      display: inline-block;
      background: url('__IMG__main1_delete.png') no-repeat right center;
      background-size: 17px 17px;
    }

    /*.comment_desc,*/
    .comment_imgs, .comment_imgs1, .comment_imgs2 {
      margin-top: 0.5rem;
      /*padding-bottom: 0.5rem;*/
    }

    .comment_imgs img, .comment_imgs1 img, .comment_imgs2 img {
      float: left;
      margin-right: 0.5rem;
      border-radius: 0.25rem;
    }

    .comment_imgs2 img {
      width: 8.5rem;
      height: 8.5rem;
    }

    .comment_imgs img:last-child, .comment_imgs1 img:last-child {
      float: left;
      margin-right: 0;
    }

    .comment_txt {
      background-color: #f5f5f5;
      padding: 0.75rem 0.5rem 0.75rem 0.75rem;
      margin-top: 0.5rem;
      /*margin-bottom: 0.3rem;*/
    }

    .red_delete {
      float: right;
      color: #E73C5C;
      font-size: 0.6rem;
      padding: 2px 0 0 10px;
    }

    .comment_one {
      padding-top: 0.3rem;
    }

    .comment_two {
      margin-top: 0.3rem;
    }

    .comment_three {
      margin-top: 0.5rem;
      color: #47A1FE;
    }

    .edit {
      width: 2.8rem;
      height: 2.8rem;
      border-radius: 50%;
      margin: 0.75rem auto;
    }

    .comment_footer {
      height: 30px;
      line-height: 30px;
      color: #b3b3b3;
      font-size: 0.8rem;
      margin-top: 0.25rem;
    }

    .comment_time {
      font-size: 0.6rem;
    }

    .zan {
      width: 22px;
      height: 30px;
      display: inline-block;
      background: url('__IMG__main1_nozan.png') no-repeat center center;
      background-size: 13px 13px;
      vertical-align: bottom;
    }

    .zan1 {
      width: 22px;
      height: 30px;
      display: inline-block;
      background: url('__IMG__main1_zan.png') no-repeat center center;
      background-size: 13px 13px;
      vertical-align: bottom;
    }

    .comment_total {
      width: 22px;
      height: 30px;
      display: inline-block;
      background: url('__IMG__main1_news.png') no-repeat center center;
      background-size: 13px 13px;
      vertical-align: bottom;
    }

    .float_right {
      display: inline-block;
      width: auto;
      height: 30px;
      line-height: 30px;
      float: right;
    }

    .comment_all {
      margin-right: 1rem;
    }

    .comment_footer {
      height: 30px;
      line-height: 30px;
      color: #b3b3b3;
      font-size: 0.8rem;
      margin-top: 0.25rem;
    }

    .comment_time {
      font-size: 0.6rem;
    }

    .zan {
      width: 22px;
      height: 30px;
      display: inline-block;
      background: url('__IMG__main1_nozan.png') no-repeat center center;
      background-size: 13px 13px;
      vertical-align: bottom;
    }

    .zan1 {
      width: 22px;
      height: 30px;
      display: inline-block;
      background: url('__IMG__main1_zan.png') no-repeat center center;
      background-size: 13px 13px;
      vertical-align: bottom;
    }

    .comment_total {
      width: 22px;
      height: 30px;
      display: inline-block;
      background: url('__IMG__main1_news.png') no-repeat center center;
      background-size: 13px 13px;
      vertical-align: bottom;
    }

    .float_right {
      display: inline-block;
      width: auto;
      height: 30px;
      line-height: 30px;
      float: right;
    }

    .comment_all {
      margin-right: 1rem;
    }

    .allImg {
      padding-bottom: 0.75rem;
    }

    .img1:nth-child(3n+2) {
      margin-right: 3%;
      margin-left: 3%;
    }

    .img1 {
      width: 100px;
      height: 100px;
      float: left;
    }

    .allImgCommen {
      padding-bottom: 0.5rem;
    }

    .img2 {
      width: 8.5rem;
      height: 8.5rem;
    }

    .img3 {
      width: 6.75rem;
      height: 6.75rem;
      margin-right: 0.5rem;
      float: left;
    }

    .img4 {
      width: 4.3rem;
      height: 4.3rem;
      float: left;
    }

    .img4:nth-child(3n+2) {
      margin-right: 2%;
      margin-left: 2%;
    }
    .warrp {
      padding: 0.75rem;
      background-color: #fff;
      padding-bottom: 0;
    }

    .header {
      width: 5.25rem;
      height: 5.25rem;
      border-radius: 0.25rem;
    }

    .header img {
      width: 5.25rem;
      height: 5.25rem;
      border-radius: 0.25rem;
      /*float: left;*/
    }

    .title {
      font-size: 0.75rem;
      color: #333333;
      font-weight: bold;
    }

    .cont {
      font-size: 0.7rem;
      color: #666666;
      line-height: 1.4rem;
    }

    .timefrom {
      margin-top: 2.15rem;
      font-size: 0.7rem;
      color: #999;
      height: 0.7rem;
      padding-bottom: 1px;
      line-height: 0.7rem;
      display: flex;
      align-items: center;
    }

    .right {
      flex: 1;
      display: flex;
      flex-flow: column;
      justify-content: space-between;
      padding-left: 0.75rem;
    }

    .timee {
      margin-right: 3px;
    }

    .timee img {
      width: 0.75rem;
      height: 0.775rem;
    }

    .title2 {
      font-weight: 700;
      color: #000000;
      font-size: 0.7rem;
      padding-bottom: 0.25rem;
      padding-left: 0.75rem;
      padding-top: 1rem;
      background: white;
    }
		</style>
</head>

<body>
	<div id="all_header">
		<div class="vedio before">
			<video id="my-player" class="video-js vjs-big-play-centered" controls poster="__IMG__zhanweitu/main3_video.png" preload="auto" webkit-playsinline="true" allowfullscreen="true" webkitallowfullscreen="true" 
			mozallowfullscreen="true" webkit-playsinline="true"
			playsinline="true" 
			x5-video-player-type="h5" 
			x5-video-player-fullscreen="true" x-webkit-airplay="allow" x5-video-orientation="portraint" data-setup='{"example_option":true}' style="width: 100%">
				<source src="__IMG__zhanweitu/black.mp4" type="video/mp4"/>
				<p class="vjs-no-js">请开启Javascript脚本以便
					<a href="http://videojs.com/html5-video-support/" target="_blank">
						支持HTML5 video播放器
					</a>
				</p>
			</video>
		</div>
		<div id="render-item-1"></div>
	</div>
	<div id="tab">
		<div class="tab-item tab-item-active underLine" onclick="changeTab(this,1)">详情</div>
		<div class="tab-item underLine" onclick="changeTab(this,2)">目录</div>
	</div>
	<div class="show-area">
		<div class="xiangqing">
			<div class="fuwenben"></div>
			<div class="comment222">
			  <div class="comment_title">评论(<span id='commentNumber'></span>)</div>
			  <div id="list1"></div>
			  <script id="template_list1" type="text/template">
			    {{ for(var i in it) { }}
			    <div class="flex-wrap" id='all_{{=it[i].comment_id}}'>
			      <div class="user_img">
			        <img src="__IMG__zhanweitu/main1.png" data-src="{{=it[i].user_image||'__IMG__zhanweitu/main1.png'}}">
			      </div>
			      <div class="flex-con">
			        <div class="user_name">{{=it[i].user_username||''}}
			          {{? $api.getStorage("allUser")}}
			          {{? it[i].user_id == $api.getStorage("allUser").user_id||''}}
			          <span class="comment_delete" onclick="fnDelete(this)" comment_id={{=it[i].comment_id}} type=1></span>
			          {{?}}
			          {{?}}
			        </div>
			        <div class="comment_desc aui-ellipsis-2">{{=it[i].comment_content||''}}</div>
			        {{? it[i].comment_img.length ==1 }}
			        <div class="allImgCommen after">
			          <img src="__IMG__zhanweitu/aaaone.png" data-src="{{=it[i].comment_img[0]||'__IMG__zhanweitu/aaaone.png'}}" class="img2">
			        </div>
			        {{?? it[i].comment_img.length ==2}}
			        <div class="allImgCommen after">
			          <img src="__IMG__zhanweitu/aaaone2.png" data-src="{{=it[i].comment_img[0]||'__IMG__zhanweitu/aaaone2.png'}}" class="img3">
			          <img src="__IMG__zhanweitu/aaaone2.png" data-src="{{=it[i].comment_img[1]||'__IMG__zhanweitu/aaaone2.png'}}" class="img3">
			        </div>
			        {{?? it[i].comment_img.length ==3}}
			        <div class="allImgCommen after">
			          <img src="__IMG__zhanweitu/aaaone3.png" data-src="{{=it[i].comment_img[0]||'__IMG__zhanweitu/aaaone3.png'}}" class="img4">
			          <img src="__IMG__zhanweitu/aaaone3.png" data-src="{{=it[i].comment_img[1]||'__IMG__zhanweitu/aaaone3.png'}}" class="img4">
			          <img src="__IMG__zhanweitu/aaaone3.png" data-src="{{=it[i].comment_img[2]||'__IMG__zhanweitu/aaaone3.png'}}" class="img4">
			        </div>
			        {{?}}
			        {{? it[i].son.length > 0 }}
			        <div class="comment_txt">
			          {{ for(var j in it[i].son) { }}
			          {{? j < 2 }}
			          <div class="comment_two" id='all_{{=it[i].son[j].comment_id||''}}'>{{=it[i].son[j].user_username||''}}：{{=it[i].son[j].comment_content||''}}
			            {{? $api.getStorage("allUser")}}
			            {{? it[i].son[j].user_id == $api.getStorage("allUser").user_id||''}}
			            <span class="red_delete" onclick="fnDelete(this)" comment_id={{=it[i].son[j].comment_id||''}} type=2>删除</span>
			            {{?}}
			            {{?}}
			          </div>
			          {{?}}
			          {{}}}
			          {{? it[i].son.length > 2 }}
			          <div class="comment_three" tapmode onclick="openALLComment(this)" idd='{{=it[i].comment_id||""}}'>查看全部评论>
			          </div>
			          {{?}}
			        </div>
			        {{?}}
			        <div class="comment_footer">
			          <span class="comment_time">{{=timePan(2,it[i].create_time)||''}}</span>
			          <span class="float_right">
			           {{? it[i].like==1}}
			              <span class="zan1"  onclick="fnZan1(this)" like={{=it[i].like}} comment_id={{=it[i].comment_id}} id=id_{{=it[i].comment_id}}></span>
			           {{?? it[i].like==2}}
			              <span class="zan"  onclick="fnZan1(this)" like={{=it[i].like}} comment_id={{=it[i].comment_id}} id=id_{{=it[i].comment_id}}></span>
			            {{?}}
			            <span id="zan_num_{{=it[i].comment_id}}">{{=it[i].like_num||'0'}}</span>
			          </span>
			          <span class="float_right comment_all" onclick="openInput(this)" tapmode='active' userUsername='{{=it[i].user_username||""}}' uid='{{=it[i].user_id||""}}' comment_id='{{=it[i].comment_id||""}}'>
			            <span class="comment_total"></span>{{=it[i].sonNum||'0'}}
			          </span>
			        </div>
			      </div>
			    </div>
			    {{}}}
			  </script>
			  <div class="comment_input underLine" tapmode="active" onclick="fnPing()">
			    <div class="comment_img"></div>
			    <input type="text" id="comment" placeholder="写评论">
			  </div>
			  <div class="footerr before" style="display: none;">
			    <div class="buy" tapmode="active" onclick="fnBuy()">购买课程</div>
			  </div>
			</div>
		</div>
		<div class="mululist" style="display: none">
			
		</div>
	</div>
</body>
<script type="text/x-handlebars-template" id="template-item-1">
	<div class="instruction">
		<div class="aui-ellipsis-2 title" id='getInformation' a_id='{{=it.id}}'>{{=it.classroom_title}}</div>
		<div class="play_all">
			<span class="play_times">播放：{{=it.classroom_playnum}}次</span>
			<span class="download"></span>
			<span class="share"></span> 
			{{?it.collection==1}}
			<span class="like"><img src="__IMG__main3_like.png" data-type="1"></span> 
			{{??}}
			<span class="like"><img src="__IMG__main3_unlike.png" data-type="2"></span> 
			{{?}}
		</div>
		{{?classroom_cate==1}}
		<div class="class_type topLine2"><span class="course_type">课程类型</span><span class="type_detail">免费</span></div>
		{{??}}
		<div class="class_type topLine2"><span class="course_type">课程类型</span><span class="money">¥{{=it.classroom_price}}</span></div>
		{{?}}
	</div>
</script>
<script type="text/x-handlebars-template" id="template-item-2">
  <div class="title2">选集播放 {{=it.num}}集全</div>
  {{~it.data:value:index}}
  <div class="warrp">
    <div class="underLine2 flex-wrap" style="padding-bottom:0.75rem" tapmode onclick="changeVideo('{{=value.catalogue_id}}')">
      <div class="header">
        <img src="__IMG__zhanweitu/main3_mulu.png" data-src="{{=value.catalogue_url||'__IMG__zhanweitu/main3_mulu.png'}}" alt="">
      </div>
      <div class="right">
        <div class="title aui-ellipsis-2">
          {{=value.catalogue_title}}
        </div>
        <div class="timefrom">
          <div class="timee">
            <img src="__IMG__main3_time.png" alt="">
          </div>
          {{=value.catalogue_time}}
        </div>
      </div>
    </div>
  </div>
  {{~}}
</script>
<script type="text/javascript" src="__JS__api.js"></script>
<script type="text/javascript" src="__JS__tt.js"></script>
<script type="text/javascript" src="__JS__aui-tab.js"></script>
<script type="text/javascript" src="__JS__doT.min.js"></script>
<script type="text/javascript" src="__JS__video.min.js"></script>
<script type="text/javascript" src="__JS__aui-lazyload.js"></script>
<script type="text/javascript" src="__JS__jquery-1.11.1.min.js"></script>
<script type="text/javascript">
	var Request = new UrlSearch(); //实例化
	var classroom_cate;//课程类型
	var classroom_id;//课程od
	var catalogue_id='';//目录id
	var myPlayer;
	var isPlay;
	var video_url;
	myPlayer = videojs('my-player');
  videojs('my-player').ready(function () {
    $api.append($api.byId('my-player'), '<div class=\'stop-button\' id="btn-change" onclick="stopAndPlay(this)"></div><div class="mask">请先购买课程</div>');
  });
  myPlayer.on('fullscreenchange', function () {
    console.log(JSON.stringify(api));
    if (this.isFullscreen()) {
      $api.byId('btn-change').className = 'unlock-button';
    } else {
      $api.byId('btn-change').className = 'stop-button';
    }
  });
  myPlayer.on('useractive', function () {
    console.log('Play useractive');
    $api.byId('btn-change').style.display = 'block';
  });
  myPlayer.on('userinactive', function () {
    console.log('Play userinactive');
    if ($api.byId('btn-change').className == 'play-button') {

    } else {
      if (!myPlayer.isFullscreen()) {
        $api.byId('btn-change').style.display = 'none';
      } else {
        if ($api.byId('btn-change').className == 'unlock-button') {
          if (isPlay) {
            setTimeout(function () {
              $api.byId('btn-change').style.display = 'none';
            }, 300);
          }
        }
      }
    }

  });
  myPlayer.on('pause', function () {
    console.log('Play pause');
    isPlay = false;
    if (!this.isFullscreen()) {
      $api.byId('btn-change').className = 'play-button';
    }
  });
  myPlayer.on('play', function () {
    console.log('Play play');
    isPlay = true;
    if (!this.isFullscreen()) {
      $api.byId('btn-change').className = 'stop-button';
    }
  });
	classroom_id=Request.id11;
	classroom_cate=Request.id12;

	//获取课程详情
	$.ajax({
			url: 'http://south.xuanwumobile.com/api/Classroom/classroomInfo',
			data: {
				claasromm_rate:classroom_cate,
				classroom_id: classroom_id,
				user_id:0
			},
			type: 'post',
			cache: false,
			dataType: 'json',
			success: function(successData) {
					if (successData.status == '200') {
						console.log(1111)
							var temp = doT.template($api.byId('template-item-1').innerHTML);
							$api.html($api.byId('render-item-1'), temp(successData.data));
							video_name = successData.data.classroom_title;
							console.log($api.dom('.mask'))
							if ($api.dom('.mask')) {
									$api.dom('.mask').style.display = 'none';
							} else {

							}
							initData2()
					}
			},
			error: function() {
					alert("异常！");
			}
	});
	//获取课程内容
	$.ajax({
		url: 'http://south.xuanwumobile.com/api/Classroom/classroomDetail',
		data: {
			classroom_id: classroom_id,
			user_id:0
		},
		type: 'post',
		cache: false,
		dataType: 'json',
		success: function(successData) {
			if (successData.status == '200') {
				$api.html($api.dom('.fuwenben'), successData.data.classroom_content);
			}
		},
		error: function() {
			alert("异常！");
		}
	});
	//课程评论
	$.ajax({
		url: 'http://south.xuanwumobile.com/api/Classroom/classroomComment',
		data: {
			classroom_id: classroom_id,
			user_id:0,
			type: 1,
      page: 1,
		},
		type: 'post',
		cache: false,
		dataType: 'json',
		success: function(data) {
			if (data.status == '200') {
				$api.byId('commentNumber').innerHTML = data.num || '0';

        var temp = doT.template($api.byId('template_list1').innerHTML);
        $api.html($api.byId('list1'), temp(data.data));

        new auiLazyload({
          errorImage: '__IMG__zhanweitu/main1.png'
        });
			}
		},
		error: function() {
			alert("异常！");
		}
	});
	//课程目录
	$.ajax({
		url: 'http://south.xuanwumobile.com/api/Classroom/catalogue',
		data: {
			classroom_id: classroom_id,
			user_id:0
		},
		type: 'post',
		cache: false,
		dataType: 'json',
		success: function(successData) {
			if (successData.status == '200') {
				var temp = doT.template($api.byId('template-item-2').innerHTML);
        $api.html($api.dom('.mululist'), temp(successData));
        new auiLazyload({
          errorImage: '__IMG__zhanweitu/main3_mulu.png'
        });
			}
		},
		error: function() {
			alert("异常！");
		}
	});

	 //播放地址
  function initData2 () {
    $.ajax({
		url: 'http://south.xuanwumobile.com/api/Classroom/videoUrl',
		data: {
			classroom_id: classroom_id,
			user_id:0,
			catalogue_id: catalogue_id
		},
		type: 'post',
		cache: false,
		dataType: 'json',
		success: function(successData) {
			if (successData.status == '200') {
				catalogue_id = successData.data.catalogue_id;
        video_url = successData.data.catalogue_url;
        myPlayer.src(video_url);
        myPlayer.load();
        myPlayer.play();
        if ($api.dom('.mask')) {
					$api.dom('.mask').style.display = 'none';
				} else {

				}
			}
		},
		error: function() {
			alert("异常！");
		}
		});
  }
	function UrlSearch() {
			var name, value;
			var str = location.href; //取得整个地址栏
			var num = str.indexOf("?")
			str = str.substr(num + 1); //取得所有参数   stringvar.substr(start [, length ]

			var arr = str.split("&"); //各个参数放到数组里
			for (var i = 0; i < arr.length; i++) {
					num = arr[i].indexOf("=");
					if (num > 0) {
							name = arr[i].substring(0, num);
							value = arr[i].substr(num + 1);
							this[name] = value;
					}
			}
	}
	//改变tab
	function changeTab(el,index){
		var active = $api.dom(".tab-item-active");
		$api.removeCls(active,"tab-item-active");
		$api.addCls(el,"tab-item-active");
		if(index==1){
			$api.dom(".xiangqing").style.display="block";
			$api.dom(".mululist").style.display="none";
		}else{
			$api.dom(".xiangqing").style.display="none";
			$api.dom(".mululist").style.display="block";
		}
	}
	//更新查看历史
  function updataHistory () {
    isVisitorLogin2(function (data) {
      if (data) {
        var parame = {
          values: {
            classroom_id: classroom_id,
            catalogue_id: catalogue_id
          }
        };
        doAjax(CLASSROOMHISTORY, 'POST', parame, function (successData) {
          if (successData.status == '200') {

          } else {
            api.toast({
              msg: successData.msg,
              duration: 2000,
              location: 'middle'
            });
          }
        }, function (err) {

        });
      }

    });

  }
	//播放器上的按钮
  function stopAndPlay (el) {
    if (el.className == 'play-button') {
      el.className = 'stop-button';
      myPlayer.play();
    } else if (el.className == 'stop-button') {
      el.className = 'play-button';
      myPlayer.pause();
    } else if (el.className == 'lock-button') {
      el.className = 'unlock-button';
      $api.dom('.vjs-control-bar').style.visibility = 'visible';
    } else if (el.className == 'unlock-button') {
      el.className = 'lock-button';
      $api.dom('.vjs-control-bar').style.visibility = 'hidden';
      if (window.orientation) {
        if (window.orientation == 90) {
          
        } else if (window.orientation == -90) {
          
        }
      }

    }
  }
  //点赞、取消点赞
	function fnZan(el) {
		var comment_id = $api.attr(el, 'comment_id');
		var like = $api.attr(el, 'like');
		var parame = {
			values: {
			  type:1,
				comment_id: comment_id,
				like:like
			}
		}
		doAjax(LIKECOMMENT, "POST", parame, function(successData) {
			if (successData.status == 200) {
				if (like==1) {
					$api.removeCls(el,'zan1');
					$api.addCls(el, 'zan');
					$api.attr(el,'like','2');
					$api.byId('zan_num_'+comment_id).innerHTML=parseInt($api.byId('zan_num_'+comment_id).innerHTML)-1;
					return;
				} else {
					$api.removeCls(el, 'zan');
					$api.addCls(el, 'zan1');
					$api.attr(el,'like','1');
					$api.byId('zan_num_'+comment_id).innerHTML=parseInt($api.byId('zan_num_'+comment_id).innerHTML)+1;
					return;
				}
			} else {
				//非200错误返回的提示
				api.toast({
					msg: successData.msg,
					duration: 2000,
					location: 'middle'
				});

			}
		}, function(errorData) {
			//失败执行函数
		})
	}

  //删除--1评论   2回复
  function fnDelete(el){
  	var comment_id = $api.attr(el, 'comment_id');
  	var type = $api.attr(el, 'type');
  	var parame = {
		values: {
			type:type,
			comment_id: comment_id,
			classroom_id:api.pageParam.id
		}
	}
	doAjax(DELCOMMENT, "POST", parame, function(data) {
			//成功执行函数
			if (data.status == '200') {

				api.toast({
				    msg: '删除成功',
				    duration: 2000,
				    location: 'middle'
				});

				$api.remove($api.byId('all_'+comment_id));

			} else {
				api.toast({
					msg: data.msg,
					duration: 2000,
					location: 'middle'
				});
			}
		}, function(errorData) {
			//失败执行函数
		});
  }
    //判断登录可以点赞游客不可以
	function fnZan1(el) {

		isVisitorLogin(function(data) {
			if (data) {
				fnZan(el);
			}
		});
	}

  //购买
  function fnBuy () {
    isVisitorLogin(function (data) {
      if (data) {
        var parame = api.pageParam;
        openWindow('buy_class_win', 'buy_class_win.html', parame);
      }
    });
  }

  function changeVideo(id){
  	//获取课程详情
		$.ajax({
			url: 'http://south.xuanwumobile.com/api/Classroom/classroomInfo',
			data: {
				claasromm_rate:classroom_cate,
				classroom_id: classroom_id,
				user_id:0
			},
			type: 'post',
			cache: false,
			dataType: 'json',
			success: function(successData) {
				if (successData.status == '200') {
					if ($api.dom('.mask')) {
							$api.dom('.mask').style.display = 'none';
					} else {

					}
					catalogue_id=id;
					initData2()
				}
			},
			error: function() {
				alert("异常！");
			}
		});
  }

  //收藏与取消收藏
  function toggleCollect (el) {
        var type = $api.attr(el, 'data-type');
        if (type == 1) {
          var parame = {
            values: {
              classroom_id: classroom_id,
              catalogue_id: catalogue_id
            }
          };
          doAjax(CLASSROOMMYCOLLECT, 'POST', parame, function (successData) {
            if (successData.status == '200') {
              el.src = '__IMG__main3_unlike.png';
              $api.attr(el, 'data-type', '2');
              api.toast({
                msg: '取消收藏成功',
                duration: 3000,
                location: 'middle'
              });
            } else {
              api.toast({
                msg: successData.msg,
                duration: 2000,
                location: 'middle'
              });
            }
          }, function (err) {

          });
        } else {
          var parame = {
            values: {
              classroom_id: classroom_id,
              catalogue_id: catalogue_id
            }
          };
          doAjax(CLASSROOMMYCOLLECT, 'POST', parame, function (successData) {
            if (successData.status == '200') {
              el.src = '__IMG__main3_like.png';
              $api.attr(el, 'data-type', '1');
              api.toast({
                msg: '收藏成功',
                duration: 3000,
                location: 'middle'
              });
            } else {
              api.toast({
                msg: successData.msg,
                duration: 2000,
                location: 'middle'
              });
            }
          }, function (err) {

          });
        }
  }

</script>

</html>